import { Component, Input, OnInit, Output , EventEmitter} from '@angular/core';
import {ModalController, NavParams} from '@ionic/angular';
import { AppGlobalService } from 'src/app/shared/service/app-global.service';
@Component({
  selector: 'app-modal-of-multiple',
  templateUrl: './modal-of-multiple.component.html',
  styleUrls: ['./modal-of-multiple.component.scss'],
})
export class ModalOfMultipleComponent implements OnInit {
  @Input() tagData: any; // 表单内直接展示
  @Output() updateItem: EventEmitter<any> = new EventEmitter();
  @Input() data: any;
  industryList: any;
  list: any = [];
  bigIndus: any = {background: false};
  selectIndus: any = [];
  checkedIndus: any = "";
  max = 0; //  最多选择多少，maxSize 显示大行业最多
  isLJModel = false;
  isBottomModal = false;
  constructor(private modalCtrl: ModalController,
              private appGlobalService: AppGlobalService,
              ) { }

  ngOnInit() {

    if (this.tagData  !== undefined) {
        this.data = this.tagData;
    }
    this.isLJModel = this.data.formType.indexOf('LJ') > -1;
    this.isBottomModal = this.data.formType.indexOf('LJBOTTOM') > -1;
    // 最大限制选择
    if (this.data.max) {
        this.max =  this.data.max;
    } else {
        this.max = 10;
    }
    let checkedValue;
    if (!this.data.value || !this.data.value.length) {
        checkedValue = [];
    } else if (this.data.value === '' ) {
      // && this.data.value.indexOf('#') == 0
        checkedValue = [];
    } else if ( typeof(this.data.value) === 'string') {
        checkedValue = this.data.value.split(',');
    } else {
        checkedValue = this.data.value;
    }
    this.list = this.data.data;
    console.log('list--->' + this.list);
    // checkedValue = this.data.value;
    console.log('checkedValue--->' + checkedValue);
    let tempBig: any;
    this.list.forEach(element => {
        element.checkLen = 0;
        if (element.children) {
            element.children.forEach(ele => {
                ele.checkLen = 0;
                if (checkedValue && checkedValue.length) {
                    checkedValue.forEach(e => {
                        if (ele.value === e) {
                            element.checkLen += 1;
                            ele.selected = true;
                            this.selectIndus.push(ele);
                            if (!tempBig) {
                                tempBig = element;
                            }
                            // this.checkNum(element, ele);
                        }
                    });
                }
            });
        } else {
            if (checkedValue && checkedValue.length) {
                checkedValue.forEach(e => {
                    if (element.value === e) {
                        element.checkLen += 1;
                        element.selected = true;
                        this.selectIndus.push(element);
                    }
                });
            }
        }
    });
    if (tempBig) {
        this.getSmallIndus(tempBig, true);
    } else {
        this.list.forEach(e => {
            e.background = false;
        })
        this.getSmallIndus(this.list[0], true);
    }
    
  }
 // 点击大行业，渲染小行业
 getSmallIndus(big, first?) {
  if (big === this.bigIndus) {
    return;
  }
  this.bigIndus.background = false;
  this.bigIndus.selected = false;

  this.bigIndus = big;
  this.bigIndus.background = true;
  {
    if (this.data.maxSize === 1) {
        // 大类只能选择一个 清除其他已选
         // 清除大区及小商区
         if (!first) {
            this.selectIndus = [];
            this.list.forEach(bigindus => {
               bigindus.checkLen = 0;
               if (bigindus.children) {
                   bigindus.children.forEach(element => {
                       element.selected = false;
                   });
               }
           });
         }

    }
  }
  if (big.label === '全国' && !first) {
    big.selected = !big.selected;
    if (big.selected) {
        // 清除省份及城市
        this.list.forEach(bigindus => {
            bigindus.checkLen = 0;
            if (bigindus.children) {
                bigindus.children.forEach(element => {
                    element.selected = false;
                });
            }

        });
        this.selectIndus = [];
        // 选中全国
        big.checkLen = 1;
        this.selectIndus.push(big);
    } else {
        this.selectIndus = [];
        big.checkLen = 0;
    }
  }
  if (big.value.length === 4 && !first) {
    big.selected = !big.selected;
    if (big.selected) {
        // 清除大区及小商区
        this.list.forEach(bigindus => {
            bigindus.checkLen = 0;
            if (bigindus.children) {
                bigindus.children.forEach(element => {
                    element.selected = false;
                });
            }

        });
        this.selectIndus = [];
        // 选中全市
        big.checkLen = 1;
        // 包含全部 全市之类==全选 小类
        if (big.children && big.children[0].value === big.value) {
            big.children[0].selected = true;
            this.selectIndus.push(big.children[0]);
        } else {
            this.selectIndus.push(big);
        }
        // 清除全国
        if (this.list[0].label === '全国') {
            this.list[0].checklen = 0;
        }

    } else {
        this.selectIndus = [];
        big.checkLen = 0;
    }
  }
  if (this.tagData && this.tagData.showValue !== 'generalSubmit') {
    // update formGroup
    // this.updateItem.emit(this.selectIndus);
  }
}
 // 选中小行业
 selectSmallIndus(bigindus, item) {
    // 清除全国 全市
  if (this.list[0].label === '全国' || this.list[0].label === '全市') {
        this.list[0].checkLen = 0;
        this.list[0].selected = false;
        const index = this.selectIndus.findIndex(v => (v.label === '全国' || v.label === '全市'));
        if (index > -1) {
            this.selectIndus.splice(index, 1);
         }
  }
  if (this.max == 1) {
    // 单选
    if (!item.selected) {
        this.selectIndus = [];
        item.selected = !item.selected;
        this.selectIndus.push(item);
        bigindus.children.forEach(element => {
            if (element !== item) {
                element.selected = false;
            }
        });
    }
  } else {
    // 多选
    item.selected = !item.selected;
    this.checkSecondLevelSize(bigindus, item);
    if (item.selected) {
          // tslint:disable-next-line:max-line-length 
        //   || (item.value.length === 6 ) 去掉 6位长度判断 不然区域选择位单选
          if ((item.value === bigindus.value) || (item.value.length === 2) ) {
              bigindus.children.forEach(element => {
                  if (element.selected) {
                      const index = this.selectIndus.findIndex(v => v.value === element.value);
                      if (index > -1) { this.selectIndus.splice(index, 1); }
                      element.selected = false;
                  }
              });
              bigindus.checkLen = 0;
              this.checkNum(item, bigindus);
              console.log("check all");
          } else {
            //   不包含全市 全行业
              if (!bigindus.children[0].selected || bigindus.children[0].value.length > bigindus.value.length) {
                  this.checkNum(item, bigindus);
                  console.log("not check all");
              } else {
                  const index = this.selectIndus.findIndex(v => v.value === bigindus.children[0].value);
                  this.selectIndus.splice(index, 1);
                  bigindus.children[0].selected = false;
                  bigindus.checkLen -= 1;
                  this.checkNum(item, bigindus);
                  console.log("dddddddddd4444");
              }
          }
    } else {
        const index = this.selectIndus.findIndex(v => v.value === item.value);
        this.selectIndus.splice(index, 1);
        bigindus.checkLen -= 1;
        if (bigindus.checkLen < 0) {
            bigindus.checkLen = 0;
        }
    }
  }
  if (this.tagData && this.tagData.showSureBtn ) {

  } else if (this.tagData && this.tagData.showValue !== 'generalSubmit' ) {
    this.updateItem.emit(this.selectIndus);
  }

}
// 单个二级类数量限制
checkSecondLevelSize(item, it) {
    if (item.maxSize && item.maxSize == "1") {
      // 清除其他类
      item.children.forEach(element => {

        if (it !== element) {
          element.selected = false;
          if (element.children && element.children.length > 0) {
            // 三级
            element.children.forEach(e => {
              e.selected = false;
              const index = this.selectIndus.findIndex(v => (v === e.value));
              if (index > -1) {
                this.selectIndus.splice(index, 1);
              }
            });
          }
          //  清除 大类、小类
          const index = this.selectIndus.findIndex(v => (v === element.value));
          if (index > -1) {
            this.selectIndus.splice(index, 1);
          }
        }
      });
    }
  }
checkNum(item, bigindus) {
  if (this.selectIndus.length >= this.max) {
      this.appGlobalService.showToast('不能超过' + this.max  + '个', 2000, 'top');
      item.selected = false;
      return;
  } else {
      item.selected = true;
      this.selectIndus.push(item);
      bigindus.checkLen = 0;
      bigindus.children.forEach(element => {
        if (element.selected) {
            bigindus.checkLen += 1;
        }

      });

  }
}

dismiss() {
    if (this.tagData) {
        // 提交
        this.updateItem.emit(this.selectIndus);
    }  else {
        this.modalCtrl.dismiss(this.selectIndus);
    }
}
reset() {
    this.selectIndus = [];
    this.list.forEach(bigindus => {
        bigindus.checkLen = 0;
        if (bigindus.children) {
            bigindus.children.forEach(element => {
                element.selected = false;
            });
        }

    });
}
cancel() {
  this.modalCtrl.dismiss();
}
}
